
import React,{useContext} from 'react'
import {ThemeContext,UPDATE_COLOR,globalThemes} from '../App'
interface IHelloProps {
  messge ?:string;
  children ?:JSX.Element,
}
const Hello:React.FC<IHelloProps> = (props:IHelloProps)=>{
 const themes = useContext(ThemeContext)
 return (

    <div>
      <h2 style={{color:themes.color}}>{props.messge}</h2>
      <button onClick={()=>{themes.dispatch && themes.dispatch({type:UPDATE_COLOR,color:themes.color==='#fff' ?  globalThemes.light : globalThemes.dart})}}>切换主题</button>
      {props.children}
    </div>
 )
}
Hello.defaultProps = {
 messge:'hello world default'
}
export default Hello
